<template>
  <div class="app-container-flex">
    <NewFullScreen
      v-model="showDialog"
      :title="title"
      :btnList="fullInfo.btnList"
      :needReturn="!$route.query.processInstanceId"
      @returnBack="returnBack"
    >
      <template v-slot:full-button>
        <el-button
            v-if="
              $permission('license:approve') &&
              infoList.data.checkStatus === 1 &&
              $store.state.permission.systemConfig
                .allow_slip_license_check_approval == 1
            "
            :plain="true"
            @click="approve"
            >批准</el-button
          >
          <el-button
            v-if="
              $permission('license:reject') &&
              infoList.data.checkStatus === 1 &&
              $store.state.permission.systemConfig
                .allow_slip_license_check_approval == 1
            "
            :plain="true"
            @click="reject"
            >驳回</el-button
          >
          <el-button
            v-if="
              $permission('license:refuse') &&
              infoList.data.checkStatus === 1 &&
              $store.state.permission.systemConfig
                .allow_slip_license_check_approval == 1
            "
            :plain="true"
            @click="refuse"
            >拒绝</el-button
          >
      </template>
      <div class="model-panel">
        <div class="model-panel-title">
          <p>{{ $t('basic_information') }}</p>
        </div>
        <div class="model-panel-body">
          <basic-information :info="infoList">
            <template v-slot:basic-licenseFilePath>
              <span>
                <ele-gallery
                  :lazy="true"
                  :size="150"
                  :source="infoList.data.licenseFilePathList"
                  title="证照"
                ></ele-gallery>
              </span>
            </template>
          </basic-information>
        </div>
      </div>
    </NewFullScreen>
  </div>
</template>

<script setup name="pendCheckLicenseDetail">
import BasicInformation from '@/components/BasicInformation/index'
import { getLicenseCheck } from '@/api/core'
import {
  getLicenseCheckDifference,
  licenseApproved, licenseRefuse,licenseReject 
} from '@/api/core'
import EleGallery from '@/components/UploadImg/eleGallery'
const { proxy } = getCurrentInstance()
const emit = defineEmits()

const props = defineProps(['visible', 'id'])
const title = ref('证照详情')
const infoList = reactive({
  diffData: {},
  data: {},
  fieldList: [
    { label: '证号', value: 'licenseNumber' },
    { label: '证照类型', value: 'licenseTypeValue' },
    { label: '证照分类', value: 'licenseApplicationTypeValue' },
    { label: '产品名称', value: 'licenseName' },
    { label: '英文名称', value: 'enName' },
    { label: '生效日期', value: 'licenseBegin' },
    { label: '失效日期', value: 'licenseEnd' },
    { label: '厂家', value: 'brandName' },
    { label: '包装规格', value: 'packedStandard' },
    { label: '有效期', value: 'validityValue' },
    { label: '生产地址', value: 'productionAddress' },
    { label: '预计用途', value: 'expectedUse' },
    { label: '存储条件', value: 'storageType' },
    { label: '状态', value: 'checkStatusValue' },
    {
      label: '备注',
      value: 'remark',
      type: 'popover',
    },
    {
      label: '证照',
      value: 'licenseFilePath',
      type: 'slot',
      className: 'not-br',
    },
  ],
})
const fullInfo = reactive({
  btnList: [],
})

const showDialog = computed({
  get() {
    return props.visible
  },
  set(newValue) {
    emit('update:visible', newValue) // 更新父组件visible
  },
})

watch(
  () => props.visible,
  (newVal) => {
    showDialog.value = newVal
  },
  {
    immediate: true,
  }
)
watch(
  () => props.id,
  (newVal) => {
    init()
  },
  {
    immediate: true,
    deep: true,
  }
)

function returnBack() {
  emit('returnBack', false)
}
function reject() {
  btnFlow(infoList.data, 'reject')
}
// 按钮审批原因弹窗
function btnFlow(row, code) {
  let currentBtnFlow = {
    title: '',
    api: null,
  }
  if (code === 'reject') {
    currentBtnFlow.title = '驳回'
    currentBtnFlow.api = licenseReject
  } else if (code === 'refuse') {
    currentBtnFlow.title = '拒绝'
    currentBtnFlow.api = licenseRefuse
  }
  proxy
    .$prompt('请输入' + currentBtnFlow.title + '理由', '提示', {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      inputValidator: proxy.$fn.maxString200,
      inputErrorMessage: currentBtnFlow.title + '理由不能超过200字符',
    })
    .then(({ value }) => {
      const data = {
        orderIds: [row.id],
        checkOpt: value,
      }
      currentBtnFlow.api(data).then((resp) => {
        if (resp && resp.success) {
          init()
        }
      })
    })
}

//确认
function approve() {
  const ids = [infoList.data.id]
  licenseApproved({orderIds: ids}).then((resp) => {
    if (resp && resp.success) {
      init()
    }
  })
}
//拒绝
function refuse() {
  btnFlow(infoList.data, 'refuse')
}

function init() {
  getLicenseCheck(props.id).then((res) => {
    if (res) {
      infoList.data = res.data
      getDiff()
    }
  })
}
function getDiff() {
  getLicenseCheckDifference(infoList.data).then((res) => {
    if (res && res.success && res.data) {
      infoList.diffData = res.data
    }
  })
}
</script>

<style scoped></style>
